<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<script src="../js/Vue/vue.js"></script>
<script src="../element-ui/lib/index.js"></script>
<link rel="stylesheet" href="../element-ui/lib/theme-chalk/index.css">
<script src="../js/Axios/axios-0.18.0.js"></script>

<div id="app">

    <el-form :model="ruleForm" status-icon :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm">
        <el-form-item label="手机号码" prop="pass">
            <el-input type="text" v-model="ruleForm.phone" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="密码" prop="pass">
            <el-input type="text" v-model="ruleForm.password" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="确认密码" prop="checkPass">
            <el-input type="text" v-model="ruleForm.newPassword1" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="确认密码" prop="checkPass">
            <el-input type="text" v-model="ruleForm.newPassword2" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="验证码" prop="age">
            <el-input v-model.number="ruleForm.code"></el-input>
        </el-form-item>
        <el-form-item>
            <el-button type="primary" @click="submitForm('ruleForm')">提交</el-button>
            <el-button @click="getCode()">获取验证码</el-button>
        </el-form-item>
    </el-form>




</div>





<script>
    new Vue({

        el: "#app",

        data() {
            return {
                ruleForm:{
                    phone:'',
                    password: '',
                    newPassword1: '',
                    newPassword2: '',
                    code: ''
                }




            }
        },

        methods: {

            submitForm(){

                let rule1 = /^\w{6,12}$/;
                let rule2 = /^(13[0-9]{9})|(15[0-9]{9})|(17[0-9]{9})|(18[0-9]{9})|(19[0-9]{9})$/;


                if (!(rule1.test(this.ruleForm.password)&&rule1.test(this.ruleForm.newPassword1)&&rule1.test(this.ruleForm.newPassword2)) ){

                    alert("密码为6~12位的数字或字母")
                    return;
                }
                if (this.ruleForm.code.length < 4 ){

                    alert("请输入验证码")
                    return;
                }
                if (!rule2.test(this.ruleForm.phone) ){

                    alert("请输入正确的手机号码")
                    return;
                }
                if (!this.ruleForm.newPassword1==this.ruleForm.newPassword2){

                    alert("前后两次密码不一致")
                    return;
                }

                let _this = this;

                axios({
                    'url': '/employee/changPassword',
                    'method': 'post',
                    data: {"phone" : _this.ruleForm.phone, "code" : _this.ruleForm.code, "password" : _this.ruleForm.password, "newPassword" : _this.ruleForm.newPassword1}
                }).then(function (res) {
                    if(res.data.code === 1){
                        // sessionStorage.setItem("businessPhone",_this.form.phone)

                        window.location.href = "../Employee/employee.html";
                        alert(res.msg)

                    }else{
                        // this.$notify({ type:'warning', message:res.msg});
                        _this.$message.error(res.msg);

                    }
                })



            },


            // 用户发送短信验证码
            async getCode() {
                this.ruleForm.code = '';
                const regex = /^(13[0-9]{9})|(15[0-9]{9})|(17[0-9]{9})|(18[0-9]{9})|(19[0-9]{9})$/;
                if (regex.test(this.ruleForm.phone)) {
                    this.msgFlag = false
                    // this.ruleForm.code = (Math.random()*1000000).toFixed(0)
                    // const res = await sendBusinessMsgApi({phone: this.ruleForm.phone})
                    axios({
                        'url': '/employee/sendMsg',
                        'method': 'post',
                        data: {"phone" : this.ruleForm.phone}
                    }).then(function (res) {
                        alert(JSON.stringify(res.data))
                    })

                } else {
                    alert("手机号码不正确")
                }
            }


        }


    })






</script>

</body>
</html>